<template>
<div>
  <div style="position: fixed;top: 0;left: 0;width: 100%;height:100%;background-color: #e6faff"></div>
  <div style="position: absolute;top: 53px;left: 0;width: 100%;height:120px;background-color:#00ccbb">
    <p style="font-size: 31px;font-weight:800;color: white;letter-spacing: 3px;margin-left: 300px;padding: 5px;font-style: italic">找工作</p>
    <p style="font-size: 31px;font-weight:800;color: white;letter-spacing: 3px;margin-left: 300px;font-style: italic">上树叶招聘</p>
  </div>
  <div style="position: fixed;top: 0;left: 0;width: 100%;z-index:999;height: 53px;background-color: #39494d">
    <h3 style="color: #00e3e6;letter-spacing: 3px;padding: 10px;margin-left: 260px">树叶招聘网</h3>
  </div>
  <div>
  <MainMenu/>
  </div>
  <div>
    <UserMenu/>
  </div>
  <div style="position:absolute;margin-top: 172px">
    <img src="../assets/resume.jpg" alt="" width="310" height="750">
  </div>
  <div style="position: absolute;top: 173px;left:307px;overflow: auto;height: 750px">
    <el-table :data="employeeTableData" style="width: 1400px">
      <el-table-column label="公司" prop="firmname" width="185"/>
      <el-table-column label="职位" prop="position" width="185"/>
      <el-table-column label="薪资范围" prop="wage" width="185"/>
      <el-table-column label="联系人" prop="contacts"  width="185"/>
      <el-table-column label="电话号码" prop="phone" width="185"/>
      <el-table-column label="公司地址" prop="firmaddress"width="185"/>
      <el-table-column>
        <template #default="scope">
          <el-popconfirm title="您确定要删除对此公司的申请职位记录么?该操作不可逆!"  @confirm="confirmEvent(scope.row.id)">
            <template #reference>
              <el-button type="danger" style="height: 30px">删除记录</el-button>
            </template>
          </el-popconfirm>
        </template>
      </el-table-column>
    </el-table>
  </div>
</div>
</template>

<style scoped>
ul {
  position: fixed;
  list-style-type: none;
  margin-left: 400px;
  padding: 0;
  overflow: hidden;
  background-color: #39494d;
}
li {
  float: left;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}
li a:hover{
  color:#00e3e6 ;
}
.dropbtn {
  background-color: #4CAF50;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  background-color: #3e8e41;
}
.el-carousel__item h3 {
  display: flex;
  color: #475669;
  opacity: 0.75;
  line-height: 300px;
  margin: 0;
}

</style>
<script>
import UserMenu from "@/components/UserMenu.vue";
import request from "@/Utils/request.js";
import MainMenu from "@/components/MainMenu.vue";
export default {
  data(){
    return{
      user:localStorage.getItem("user")?JSON.parse(localStorage.getItem("user")):{},
      employeeTableData:[],
      centerDialogVisible:false
    }
  },
  methods:{
    confirmEvent(id){
      request.put(`/user/updatebyaccount/${id}`,this.employeeTableData).then(res=>{
        this.centerDialogVisible=false
        this.$message({
          message:'删除成功!',
          type:'success'
        })
        setTimeout(()=>{
          location.reload()
        },2000)
      })
    },
    exit(){
      localStorage.removeItem("user");
      this.$router.push('/')
      this.$message({
        message:'退出成功!',
        type:'success'
      })
    }
  },
  mounted(){
    request.get('/user/findresume',
        {
          params:{
            account:this.user.account
          }
        }).then(res=>{
          console.log(res)
          this.employeeTableData=res
        }
    )
  },
  components:{
    UserMenu,MainMenu
  }
}
</script>